import { defineStore } from "pinia";

interface ITab{
    title: string,
    path: string,
    isActive: boolean
}

const useTabsStore = defineStore("tabs", {
    state(){
        return {
            tabs:[
                {
                    title: '总览',
                    path: '/totalview',
                    isActive: true
                },
            ]
        };
    },
    actions:{
        // 添加当前访问的tab记录
        addTab(tab:ITab){
            // 将所有标签的激活字段设置为 false
            this.tabs = this.tabs.map(t => {
                t.isActive = false
                return t
            })

            // 查找数组中是否有当前的标签
            const has = this.tabs.find(t => t.path === tab.path)

            // 不存在当前标签，则添加到数组中，存在，则将其激活属性设置为 true
            if (!has) {
                this.tabs.push({
                ...tab,
                isActive: true,
                })
            } else {
                has.isActive = true
            }
        },
        removeTab(path:string){
            /* 判断移除的是否为激活项 */
            const index = this.tabs.findIndex(curr => curr.path === tab)
            if (index === 0) {
                return
            }
            const isActive = this.tabs[index].active
            if (isActive) { // 是移除的激活项
                // 如果有后一项标签，则将后一项标签测试为激活状态，没有后一项标签，则将前一项设置为激活
                if (index >= this.tabs.length - 1) {
                this.tabs[index - 1].active = true
                } else {
                this.tabs[index + 1].active = true
                }
            }
            /* 删除标签 */
            this.tabs.splice(index, 1)
        },
        removeByCommand(command:string){
            switch(command){
                case 'current': // 关闭当前标签页
                console.log('关闭当前标签页')
                    this.tabs = this.tabs.filter(tab=>!tab.isActive);
                    break;
                case 'other': // 关闭其他标签页
                    console.log('关闭其他标签页')
                    this.tabs = this.tabs.filter(tab=>tab.isActive);
                    break;
                case 'all': // 关闭所有标签页
                    console.log('关闭所有标签页')
                    this.tabs = [];
                    break;
            }
        },
    },
    getters:{
        activeTabPath(): string {
            return this.tabs.find(tab => tab.isActive)?.path as string;
          }
    },
    // persist: {
    //   storage: sessionStorage,
    // }
})

export default useTabsStore